<template>
  <div class="pages fullreductionaadd" id="app">
    <div class="pageLevel">
      <div class="head-box">
        <el-steps :active="active">
          <el-step title="基本信息" description=" "></el-step>
          <el-step title="发放使用" description=" "></el-step>
          <el-step title="券面信息" description=" "></el-step>
        </el-steps>
      </div>
      <div class="content">
        <div class="from_main infon">
          <div class="infon_text">
            <span class="infon_shu"></span>
            <span class="infon_text_t">{{ message[active] }}</span>
          </div>
        </div>
        <div class="content-form" v-if="active == 1">
          <el-form
            :model="ruleForm"
            :rules="rules"
            ref="ruleForm"
            label-width="100px"
            class="demo-ruleForm"
          >
            <el-form-item label="优惠券标题:" prop="name">
              <el-input v-model="ruleForm.name" size="mini" maxlength="20"></el-input>
              <span style="color: #c0c4cc;">建议主标题提示券适用的地域。例如:仅限北京的门店参加</span>
            </el-form-item>
            <el-form-item label="优惠券副标题:">
              <el-input v-model="ruleForm.region" size="mini" maxlength="19"></el-input>
              <span style="color: #c0c4cc;">建议副标题提示券适用的品类。例如：仅限奶粉品类参加</span>
            </el-form-item>
            <el-form-item label="优惠类型" prop="resource">
              <el-radio v-model="ruleForm.resource" label="1">满减券</el-radio>
            </el-form-item>
            <el-form-item label="面值:" prop="rate1">
              <el-input v-model="ruleForm.rate1" size="mini" maxlength="20"></el-input>
            </el-form-item>
            <el-form-item label="满多少元可使用" label-width="150px" prop="rate">
              <div class="mjje">
                <div style="float:left; width: 180px;height: 60px;">
                  <el-form-item>
                    <!-- <div style=" float:left;">满</div> -->
                    <div class="inp-qw-price" style=" float:left;width: 100px;height: 60px; ">
                      <sd-input :val.sync="ruleForm.rate"></sd-input>
                    </div>
                    <span>&nbsp;&nbsp;元，</span>
                  </el-form-item>
                </div>
              </div>
            </el-form-item>
            <el-form-item prop="validDay" class="newRowtwo" label="有效期" style="font-weight:700">
              <el-radio @change="validTill" label="0" v-model="ruleForm.radios">按固定天数设置</el-radio>
              <span>领取后</span>
              <el-input
                :disabled="ruleForm.adate"
                size="small"
                style="width:100px"
                v-model="ruleForm.validDay"
                placeholder="单位为天"
              ></el-input>
              <span>天内有效</span>
            </el-form-item>
            <el-form-item prop="dates" class="newRowtwo" label style="font-weight:700">
              <div class="timeDate">
                <el-radio @change="validTill" label="1" v-model="ruleForm.radios">按日期设置</el-radio>
                <el-date-picker
                  format="yyyy-MM-dd"
                  v-model="ruleForm.value6"
                  :disabled="!ruleForm.adate"
                  size="small"
                  value-format="yyyy-MM-dd"
                  unlink-panels
                  type="daterange"
                  range-separator="-"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  clearable
                ></el-date-picker>

                <div class="content-spans">
                  提示：选择第二种时，活动开始时间 >= (早于等于) 券的开始时间 且
                  活动结束时间 >= 券结束时间
                </div>
              </div>
            </el-form-item>
            <div class="tail">
              <el-form-item>
                <el-button type="primary" @click="submitForm('ruleForm')">下一步</el-button>
              </el-form-item>
            </div>
          </el-form>
        </div>
        <div class="content-form1" v-if="active == 2">
          <el-form
            :model="ruleFormUse"
            :rules="rules"
            ref="ruleFormUse"
            label-width="100px"
            class="demo-ruleForm"
          >
            <el-form-item label="门店范围" prop="shopList">
              <el-col class="colLine" :span="20">
              <el-button
                type="primary"
                v-if="showAddshop"
                size="mini"
                @click="clickSelectStores()"
              >选择门店</el-button>
              <el-button
                type="primary"
                size="mini"
                v-if="showAddshop"
                @click="deletmoreStore(multipleTable,ruleFormUse.shopList)"
                plain
              >批量删除</el-button>
              <el-table
                max-height="250"
                ref="multipleTable"
                :data="ruleFormUse.shopList"
                @selection-change="handleSelectionChange"
                style="width: 100%;margin-top:10px"
              >
                <el-table-column v-if="showAddshop" type="selection" width="55"></el-table-column>
                <el-table-column prop="name" align="center" label="门店名称"></el-table-column>
                <el-table-column prop="shopType" align="center" label="类型" :formatter="shopTypeof"></el-table-column>
                <el-table-column v-if="showAddshop" align="center" label="操作">
                  <template slot-scope="scope">
                    <el-button
                      type="text"
                      @click="deleteStore(scope.$index, ruleFormUse.shopList)"
                    >删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
                 </el-col>
            </el-form-item>

            <el-form-item label="适用范围 " prop="use">
              <el-col class="colLine" :span="20" style>
                <el-form-item>
                  <el-checkbox
                    v-model="ruleFormUse.rangeList[0].check"
                    label="0"
                    @change="commods"
                  >商品范围</el-checkbox>
                  <el-select
                    v-model="ruleFormUse.rangeList[0].joinType"
                    placeholder="请选择"
                    @change="changejoinType"
                    v-if="ruleFormUse.rangeList[0].check"
                  >
                    <el-option label="全部商品" value="0"></el-option>
                    <el-option label="按品牌+分类设置" value="2"></el-option>
                    <el-option label="指定商品" value="1"></el-option>
                  </el-select>
                  <el-checkbox
                    v-model="ruleFormUse.rangeList[0].joinBoolean"
                    v-if="ruleFormUse.rangeList[0].joinType == 1||ruleFormUse.rangeList[0].joinType==2"
                    label="0"
                  >选择范围不可用</el-checkbox>
                  <el-button
                    @click="goods(),dialogTableVisible_good = true"
                    style=" margin-left: 30px;"
                     size="mini"
                    type="primary"
                    v-if="ruleFormUse.rangeList[0].joinType == 1"
                  >添加商品</el-button>
                  <el-button
                    type="primary"
                    v-if="ruleFormUse.rangeList[0].joinType == 1"
                    size="mini"
                    @click="deletmoreStore(multipleTablegoods,Datagodds)"
                    plain
                  >批量删除</el-button>
                  <br />
                  <el-form-item
                    class="smallItem"
                    label-width="114px"
                    label="品牌 "
                    v-if="ruleFormUse.rangeList[0].joinType == 2"
                  >
                    <el-cascader
                      v-model="ruleFormUse.rangeList[0].commodBrand"
                      :options="LabelListt"
                      :props="propsbrand"
                      :show-all-levels="false"
                      collapse-tags
                      clearable
                    ></el-cascader>
                  </el-form-item>
                  <el-form-item
                    class="smallItem"
                    label-width="50px"
                    label="分类"
                    v-if="ruleFormUse.rangeList[0].joinType == 2"
                  >
                    <el-cascader
                      v-model="ruleFormUse.rangeList[0].classi"
                      :options="commodityCategoryfunList"
                      :props="props"
                      :show-all-levels="false"
                      collapse-tags
                      clearable
                    ></el-cascader>
                  </el-form-item>
                </el-form-item>
              </el-col>
              <el-col class="colLine"  :span="20" v-if="ruleFormUse.rangeList[0].joinType == 1">
                <el-table
                  :data="Datagodds"
                  border
                  style="width: 100%;margin-top:10px"
                  ref="multipleTablegoods"
                  @selection-change="handleSelectionChangegoods"
                >
                  <el-table-column type="selection" width="55"></el-table-column>
                  <el-table-column prop="barCode" label="商品条码" width="120" align="center"></el-table-column>
                  <el-table-column prop="name" label="商品名称" width="120" align="center"></el-table-column>
                  <el-table-column prop="brand" label="品牌" align="center"></el-table-column>
                  <el-table-column prop="primaryClassify" label="分类" width="150" align="center"></el-table-column>
                  <el-table-column align="center" label="操作">
                    <template slot-scope="scope">
                      <el-button type="text" @click="handleCancel_good(scope.$index)" size="mini">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </el-col>
              <!-- </el-form-item>
              <el-form-item label="适用服务 ">-->
              <el-col class="colLine" :span="20">
                <el-form-item>
                  <el-checkbox
                    v-model="ruleFormUse.rangeList[1].check"
                    label="0"
                    @change="serves"
                  >服务范围</el-checkbox>
                  <el-select
                    v-model="ruleFormUse.rangeList[1].joinType"
                    placeholder="请选择"
                    v-if="ruleFormUse.rangeList[1].check"
                  >
                    <el-option label="全部服务" value="0"></el-option>
                    <el-option label="指定服务" value="1"></el-option>
                  </el-select>
                  <el-checkbox
                    v-model="ruleFormUse.rangeList[1].joinBoolean"
                    v-if="ruleFormUse.rangeList[1].joinType == 1"
                    label="0"
                  >选择范围不可用</el-checkbox>
                  <el-button
                    v-if="ruleFormUse.rangeList[1].joinType == 1"
                    @click="getserdata(),dialogTableVisible_serve = true"
                    style=" margin-left: 30px;"
                     size="mini"
                    type="primary"
                  >添加服务</el-button>
                  <el-button
                    type="primary"
                    size="mini"
                    v-if="ruleFormUse.rangeList[1].joinType == 1"
                    @click="deletmoreStore(multipleTableservice,Dataserve)"
                    plain
                  >批量删除</el-button>
                </el-form-item>
              </el-col>
              <el-col class="colLine"  :span="20" v-if="ruleFormUse.rangeList[1].joinType == 1">
                <el-table
                  :data="Dataserve"
                  border
                  style="width: 100%;margin-top:10px"
                  ref="multipleTableservice"
                  @selection-change="handleSelectionChangeservice"
                >
                  <el-table-column type="selection" width="55"></el-table-column>
                  <el-table-column prop="name" align="center" label="服务名称"></el-table-column>
                  <el-table-column prop="serviceTime" align="center" label="时长(分)"></el-table-column>
                  <el-table-column prop="price" align="center" label="价格(元)"></el-table-column>
                  <el-table-column align="center" label="操作">
                    <template slot-scope="scope">
                      <el-button
                        type="text"
                        @click="handleCancel_serve(scope.$index)"
                        size="mini"
                      >删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </el-col>
              <!-- </el-form-item>
              <el-form-item label="次卡范围 ">-->
              <el-col :span="20" class="colLine" >
                <el-form-item>
                  <el-checkbox
                    v-model="ruleFormUse.rangeList[2].check"
                    label="0"
                    @change="cards"
                  >次卡范围</el-checkbox>
                  <el-select
                    v-model="ruleFormUse.rangeList[2].joinType"
                    placeholder="请选择"
                    v-if="ruleFormUse.rangeList[2].check"
                  >
                    <el-option label="全部次卡" value="0"></el-option>
                    <el-option label="指定次卡" value="1"></el-option>
                  </el-select>
                  <el-button
                    v-if="ruleFormUse.rangeList[2].joinType == 1"
                    @click="getcika(),dialogTableVisible_card = true"
                    style=" margin-left: 30px;"
                     size="mini"
                    type="primary"
                  >添加次卡</el-button>
                  <el-button
                    type="primary"
                    size="mini"
                    v-if="ruleFormUse.rangeList[2].joinType == 1"
                    @click="deletmoreStore(multipleTablecards,tableData)"
                    plain
                  >批量删除</el-button>
                </el-form-item>
              </el-col>
              <el-col class="colLine"  :span="20" v-if="ruleFormUse.rangeList[2].joinType == 1">
                <el-table
                  :data="tableData"
                  border
                  style="width: 100%;margin-top:10px"
                  ref="multipleTablecard"
                  @selection-change="handleSelectionChangecard"
                >
                  <el-table-column type="selection" width="55"></el-table-column>
                  <el-table-column prop="code" label="编码" width="110" align="center"></el-table-column>
                  <el-table-column prop="name" label="卡名" width="110" align="center"></el-table-column>
                  <el-table-column prop="servicesName" label="服务" align="center"></el-table-column>
                  <el-table-column prop="times" label="次数" width="110" align="center"></el-table-column>
                  <el-table-column prop="originPrice" label="价格" width="110" align="center"></el-table-column>
                  <el-table-column align="center" label="操作">
                    <template slot-scope="scope">
                      <el-button type="text" @click="handleCancel(scope.$index)" size="mini">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </el-col>
            </el-form-item>
            <div class="tail">
              <el-form-item>
                <el-button @click="astep(0)">上一步</el-button>
                <el-button type="primary" @click="Radio()">下一步</el-button>
              </el-form-item>
            </div>
          </el-form>
        </div>
        <div class="content-form" v-if="active == 3">
          <el-form
            :model="ruleFormTicket"
            :rules="rules"
            ref="ruleFormTicket"
            label-width="100px"
            class="demo-ruleForm"
          >
            <el-form-item label="优惠说明: " prop="explain">
              <el-input
                type="textarea"
                v-model="ruleFormTicket.explain"
                placeholder="优惠说明"
                :autosize="{ minRows: 6, maxRows: 4 }"
              ></el-input>
              <span class="wordNumber">{{ ruleFormTicket.explain.length }}/200</span>
            </el-form-item>
            <el-form-item label="使用须知: ">
              <el-input
                type="textarea"
                v-model="ruleFormTicket.use"
                :autosize="{ minRows: 8, maxRows: 4 }"
                placeholder="请说明使用限制如：参与门店（全部门店/指定门店/某区域门店）；参与商品（全部/品类/品牌）"
              ></el-input>
              <span class="wordNumber">{{ ruleFormTicket.use.length }}/2000</span>
            </el-form-item>
            <el-form-item>
              <el-button @click="astep(1)">上一步</el-button>
              <el-button type="primary" @click="submitFormwc('ruleFormTicket')">完成</el-button>
            </el-form-item>
          </el-form>
        </div>
      </div>
    </div>
    <!-- 商品选择弹出框 -->
    <el-dialog
      title="商品选择"
      class="addshopname"
      :visible.sync="dialogTableVisible_good"
      :closeOnClickModal="false"
      :closeOnPressEscape="false"
      width="60%"
    >
      <i class="el-icon-close icon" @click="dialogTableVisible_good = false"></i>
      <div class="operationBox tableSearch">
        <el-button size="mini" type="primary" @click="save_good">选择</el-button>
        <el-button size="mini" @click="dialogTableVisible_good = false">取消</el-button>
      </div>
      <div class="tableSearch tableSearchs">
        <el-form label-width="100px" class="demo-ruleForm">
          <el-form-item label label-width="15px">
            <el-input class="input" v-model="keyword" size="small" placeholder="输入商品名称或编号"></el-input>
          </el-form-item>
          <el-form-item label="分类：" label-width="100px">
            <el-select
              size="mini"
              clearable
              filterable
              v-model="commodityClassification"
              placeholder="全部"
            >
              <el-option
                v-for="(item, index) in saleStatusArray"
                :key="index"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="品牌:" label-width="100px">
            <el-select
              clearable
              size="small"
              filterable
              style="width:200px"
              v-model="commodBrand"
              placeholder="请先选择商品品牌"
            >
              <el-option
                v-for="(item,index) in commodityBrandList"
                :key="index"
                :label="item.name"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label label-width="15px">
            <el-button type="primary" size="mini" @click="selectgoods" class="Button">查询</el-button>
          </el-form-item>
          <!-- <el-form-item label label-width="15px">
            <el-button type="primary" size="mini" @click="reset" class="Button">重置</el-button>
          </el-form-item>-->
        </el-form>
      </div>
      <el-table
        :data="goodArray"
        ref="multipleTablegood"
        tooltip-effect="dark"
        highlight-current-row
        @selection-change="changeFun_good"
        :row-key="getRowKeysStore"
      >
        <el-table-column type="selection" width="55" :reserve-selection="true"></el-table-column>
        <el-table-column type="index" width="50" label="序号"></el-table-column>
        <el-table-column prop="barCode" label="商品条码" align="center"></el-table-column>
        <el-table-column prop="name" label="商品" align="center"></el-table-column>
        <el-table-column prop="brand" label="品牌" align="center"></el-table-column>
        <el-table-column prop="primaryClassify" label="分类" width="150" align="center"></el-table-column>
      </el-table>
      <page-unit :pageData="pageDataGoods" :func="getGoods"></page-unit>
    </el-dialog>
    <!-- 服务选择弹出框 -->
    <el-dialog
      title="服务选择"
      class="addshopname"
      :visible.sync="dialogTableVisible_serve"
      :closeOnClickModal="false"
      :closeOnPressEscape="false"
      width="60%"
    >
      <i class="el-icon-close icon" @click="dialogTableVisible_serve = false"></i>
      <div class="operationBox tableSearch">
        <el-button size="mini" type="primary" @click="save_serve">选择</el-button>
        <el-button size="mini" @click="dialogTableVisible_serve = false">取消</el-button>
      </div>
      <div class="tableSearch tableSearchs">
        <!-- <i class="el-input__icon el-icon-search" @click="getServiceData"></i> -->
        <el-form label-width="100px" class="demo-ruleForm">
          <el-form-item label label-width="15px">
            <el-input class="input" v-model="keywordCang" size="small" placeholder="输入服务名称"></el-input>
          </el-form-item>
          <el-form-item label label-width="10px">
            <el-button type="primary" size="small" @click="searchSelectCang">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-table
        :data="cangArray"
        height="300"
        ref="multipleTableser"
        tooltip-effect="dark"
        highlight-current-row
        @selection-change="changeFun_serve"
        :row-key="getRowKeysStore"
      >
        <el-table-column type="selection" width="50" :reserve-selection="true"></el-table-column>
        <el-table-column prop="name" align="center" label="服务名称"></el-table-column>
        <el-table-column prop="serviceTime" align="center" label="时长(分)"></el-table-column>
        <el-table-column prop="price" align="center" label="价格(元)"></el-table-column>
        <!-- <el-table-column prop="state" align="center" :formatter="states" label="状态"></el-table-column> -->
      </el-table>
      <page-unit :pageData="pageDataService" :func="getServiceData"></page-unit>
    </el-dialog>
    <!-- 次卡选择弹出框 -->
    <el-dialog
      title="次卡选择"
      class="addshopname"
      :visible.sync="dialogTableVisible_card"
      :closeOnClickModal="false"
      :closeOnPressEscape="false"
      width="60%"
    >
      <i class="el-icon-close icon" @click="dialogTableVisible_card = false"></i>
      <div class="operationBox tableSearch">
        <el-button size="mini" type="primary" @click="save_card">选择</el-button>
        <el-button size="mini" @click="dialogTableVisible_card = false">取消</el-button>
      </div>
      <div class="tableSearch tableSearchs">
        <!-- <i class="el-input__icon el-icon-search" @click="cikalist"></i> -->
        <el-form label-width="100px" class="demo-ruleForm">
          <el-form-item label label-width="15px">
            <el-input class="input" v-model="keywordcard" size="small" placeholder="输入次卡名称"></el-input>
          </el-form-item>
          <el-form-item label label-width="10px">
            <el-button type="primary" size="small" @click="getcikaData">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-table
        :data="tableDatacard"
        height="300"
        ref="multipleTablecard"
        tooltip-effect="dark"
        highlight-current-row
        @selection-change="changeFun_card"
        :row-key="getRowKeysStore"
      >
        <el-table-column type="selection" width="50" :reserve-selection="true"></el-table-column>
        <el-table-column prop="code" label="编号" align="center"></el-table-column>
        <el-table-column prop="name" label="卡名" align="center"></el-table-column>
        <el-table-column prop="servicesName" align="center" label="服务"></el-table-column>
        <el-table-column prop="times" align="center" label="次数"></el-table-column>
        <el-table-column prop="originPrice" align="center" label="价格"></el-table-column>
      </el-table>
      <page-unit :pageData="pageDataCard" :func="cikalist"></page-unit>
    </el-dialog>
    <!-- 选择门店弹出窗 -->
    <el-dialog
      title="选择门店"
      :visible.sync="dialogStore"
      :closeOnClickModal="false"
      :closeOnPressEscape="false"
    >
      <div class="tableSearch">
        <el-form size="mini" label-width="50px">
          <el-row>
            <el-form-item>
              <el-input v-model="selectData.storeName" placeholder="请输入门店名称"></el-input>
            </el-form-item>
            <el-form-item label="类型">
              <el-select v-model="selectData.storeType" placeholder="请选择">
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label label-width="10px">
              <el-button type="primary" @click="searchStore()">查询</el-button>
            </el-form-item>
            <!-- <el-form-item label label-width="10px">
              <el-button @click="resetStore()">重置</el-button>
            </el-form-item>-->
          </el-row>
          <el-row>
            <el-form-item label label-width="10px">
              <el-button type="primary" @click="confirmSelectStore()">选择</el-button>
            </el-form-item>
            <el-form-item label label-width="10px">
              <el-button @click="dialogStore = false">取消</el-button>
            </el-form-item>
          </el-row>
        </el-form>
      </div>
      <el-table
        :data="tableDataDialogStore"
        height="300"
        ref="multipleTableStore"
        tooltip-effect="dark"
        highlight-current-row
        @selection-change="selectStore"
        :row-key="getRowKeysStore"
      >
        <el-table-column type="selection" width="50" :reserve-selection="true"></el-table-column>
        <el-table-column prop="name" label="门店名称" align="center"></el-table-column>
        <el-table-column prop="shopType" :formatter="shopTypeof" align="center" label="类型"></el-table-column>
      </el-table>
      <page-unit :pageData="pageDataStore" :func="getStore"></page-unit>
    </el-dialog>
  </div>
</template>
<script>
import { mapState } from "vuex";
import sdInput from "@/components/SdInput";
import pageUnit from "@/components/Page";
import {
  findGoodsListPage,
  serviceListPage,
  timesCardListPage,
  saveOrUpdateMarketTicket,
  getMarketTicketDetail,
  selectBaseShopPageList,
  getGoodsClassifyTreeList,
  getGoodsLabelListByShopId
} from "@/api";
import util from "@/util";
import state from "@/util/state";
export default {
  components: { sdInput, pageUnit },
  computed: {
    ...mapState({
      merchantId: state => state.merchantId,
      userInfo: state => state.userInfo,
      pageLevel: state => state.pageLevel,
      linkName: state => state.linkName,
      shopType: state => state.shopType,
      isShop: state => state.isShop,
      companyName: state => state.companyName
    })
  },
  data() {
    return {
      editType: "",
      id: "",
      //   states: states,
      saleStatusArray: [],
      commodityBrandList: [],
      commodityClassification: "",
      commodBrand: "",
      active: 1,
      message: ["", "基本信息", "发放使用", "券面信息"],
      dialogTableVisible_card: false,
      tableData: [],
      selection_card: [],
      keywordcard: "",
      dialogTableVisible_serve: false,
      cangArray: [],
      Dataserve: [],
      selection_serve: [],
      keywordCang: "",
      dialogTableVisible_good: false,
      goodArray: [],
      selection_good: [],
      //商品分页
      Datagodds: [],
      keyword: "",
      ruleForm: {
        validDay: "",
        adate: false,
        value6: [],
        name: "",
        rate: "",
        rate1: "",
        region: "",
        resource: "1",
        radios: "0"
      },
      ruleFormUse: {
        commod: "",
        commodAdd: false,
        serve: "",
        serveAdd: false,
        card: "",
        cardAdd: false,
        shopList: [],
        rangeList: [
          {
            check: false, //是否选择商品
            applyType: "0", //适用类型：0-商品，1-服务，2-次卡
            joinType: "", //参与类型：0-全部参与，1-指定，2-按品牌和分类
            isUse: "", //选择范围是否可用：0-是，1-否
            joinBoolean: false,
            commodBrand: [], //商品品牌
            classi: [], //商品分类
            goodsList: [
              // {
              //   //指定集合
              //   goodsId: "", //商品ID 或 服务Id 或 次卡Id
              //   goodsName: "", //商品名称 或 服务名称 或 次卡名称
              //   goodsType: "", //商品类型：0-商品，1-服务，2-次卡
              //   price: "" //价格
              // }
            ],
            conditionList: [
              // //按品牌和分类集合
              // {
              //   conditionId: "", //品牌Id 或 分类id
              //   conditionType: "" //商品属性：0-品牌，1-分类
              // }
            ]
          },
          {
            check: false, //是否选择服务
            applyType: "1", //适用类型：0-商品，1-服务，2-次卡
            joinType: "", //参与类型：0-全部参与，1-指定，
            joinBoolean: false,
            isUse: "", //选择范围是否可用：0-是，1-否
            goodsList: [],
            conditionList: []
          },
          {
            check: false, //是否选择次卡
            applyType: "2", //适用类型：0-商品，1-服务，2-次卡
            joinType: "", //参与类型：0-全部参与，1-指定，2-按品牌和分类
            // isUse: "", //选择范围是否可用：0-是，1-否
            goodsList: [],
            conditionList: []
          }
        ]
      },
      ruleFormTicket: {
        explain: "",
        use: ""
      },
      rules: {
        name: [
          { required: true, message: "请输入优惠券标题", trigger: "blur" },
          { max: 20, message: "长度在20个字符之内", trigger: "blur" }
        ],
        region: [{ max: 19, message: "长度最多 19 个字符", trigger: "blur" }],
        rate: [
          { required: true, message: "请设置满多少元可使用", trigger: "change" }
        ],
        rate1: [
          { required: true, message: "请设置面值", trigger: "change" },
          { validator: util.getMoney, trigger: "blur" }
        ],
        radios: [
          { required: true, message: "请设置有效期", trigger: "change" }
        ],
        explain: [
          { required: true, message: "请输入优惠说明", trigger: "blur" },
          { max: 200, message: "长度在200个字符之内", trigger: "blur" }
        ],
        use: [{ max: 2000, message: "长度在2000个字符之内", trigger: "blur" }],
        shopList: [{ required: true, message: " " }],
        use: [{ required: true, message: " " }]
      },
      tableDatacard: [],
      pageDataStore: {
        pageSize: 5,
        currentPage: 1,
        totalItems: 0,
        pageSizeArr: [5, 10, 20]
      },
      pageDataGoods: {
        pageSize: 5,
        currentPage: 1,
        totalItems: 0,
        pageSizeArr: [5, 10, 20]
      },
      pageDataService: {
        pageSize: 5,
        currentPage: 1,
        totalItems: 0,
        pageSizeArr: [5, 10, 20]
      },
      pageDataCard: {
        pageSize: 5,
        currentPage: 1,
        totalItems: 0,
        pageSizeArr: [5, 10, 20]
      },
      shopTypeof: state.shopType,
      selectData: {
        storeName: "", // 门店名称
        storeType: "", // 门店类型
        ticketName: ""
      },
      tableDataDialogStore: [], // 弹窗门店数组
      getRowKeysStore(row) {
        return row.id;
      },
      mutableStore: [], // 多选选择门店存入的数组
      options: [
        // 门店类型
        { value: "", label: "全部" },
        { value: "0", label: "直营店" },
        { value: "1", label: "加盟店" }
      ],
      dialogStore: false, // 门店弹窗
      commodityCategoryfunList: [], //商品分类数组
      LabelListt: [], //商品品牌
      props: { multiple: true, emitPath: false },
      propsbrand: {
        multiple: true,
        label: "name",
        value: "id",
        emitPath: false
      },
      //门店多选
      multipleTable: [],
      multipleTablegoods: [],
      multipleTableservice: [],
      multipleTablecards: [],
      multipleTableStore: [],
      showAddshop: true
    };
  },
  created() {
    this.id = util.getQuery().id;
    this.editType = util.getQuery().type;
    this.commodityCategoryfun();
    this.commodityBrand();
  },
  mounted() {
    if (this.id != "" && this.id != null && this.id != undefined) {
      this.detail();
    }
    if (this.isShop == 0) {
      let storerow = {
        id: this.merchantId,
        name: this.companyName,
        shopType: this.shopType
      };
      this.showAddshop = false;
      this.ruleFormUse.shopList = [storerow];
    }
  },
  methods: {
    //===============data============
    //编辑详情data
    detail() {
      let datas = {
        id: this.id
      };
      getMarketTicketDetail(datas).then(res => {
        if (this.editType == "copy") {
          this.id = "";
        }
        let Data = res.data;
        this.ruleForm.name = Data.ticketName;
        this.ruleForm.region = Data.ticketSubName;
        this.ruleForm.resource = Data.ticketType.toString();
        this.ruleForm.rate1 = Data.ticketAmount;
        this.ruleForm.rate = Data.limitAmount;
        this.ruleForm.radios = Data.validType.toString();
        this.ruleForm.validDay = Data.validDay;
        this.ruleFormTicket.explain = Data.ticketDesc;
        this.ruleFormTicket.use = Data.useInstructions;
        this.ruleFormUse.shopList = Data.shopList;
        if (Data.goodsList[0].joinType != null) {
          this.ruleFormUse.rangeList[0].check = true;
          if (Data.goodsList[0].joinType == 0) {
            this.ruleFormUse.rangeList[0].joinType = "0";
            this.ruleFormUse.rangeList[0].joinBoolean =
              Data.goodsList[0].isUse == 0
                ? false
                : Data.goodsList[0].isUse == 1
                ? true
                : "";
          } else if (Data.goodsList[0].joinType == 1) {
            this.ruleFormUse.rangeList[0].joinType = "1";
            this.Datagodds = Data.goodsList[0].list;
            this.ruleFormUse.rangeList[0].joinBoolean =
              Data.goodsList[0].isUse == 0
                ? false
                : Data.goodsList[0].isUse == 1
                ? true
                : "";
          } else if (Data.goodsList[0].joinType == 2) {
            this.ruleFormUse.rangeList[0].joinType = "2";
            this.ruleFormUse.rangeList[0].commodBrand =
              Data.goodsList[0].brandIds;
            this.ruleFormUse.rangeList[0].joinBoolean =
              Data.goodsList[0].isUse == 0
                ? false
                : Data.goodsList[0].isUse == 1
                ? true
                : "";
            this.ruleFormUse.rangeList[0].classi = Data.goodsList[0].typeIds;
          }
        }
        if (Data.serviceList[0].joinType != null) {
          this.ruleFormUse.rangeList[1].check = true;
          if (Data.serviceList[0].joinType == 0) {
            this.ruleFormUse.rangeList[1].joinType = "0";
            this.ruleFormUse.rangeList[1].joinBoolean =
              Data.serviceList[0].isUse == 0
                ? false
                : Data.serviceList[0].isUse == 1
                ? true
                : "";
          } else if (Data.serviceList[0].joinType == 1) {
            this.ruleFormUse.rangeList[1].joinType = "1";
            this.Dataserve = Data.serviceList[0].list;
            this.ruleFormUse.rangeList[1].joinBoolean =
              Data.serviceList[0].isUse == 0
                ? false
                : Data.serviceList[0].isUse == 1
                ? true
                : "";
          }
        }
        if (Data.cardList[0].joinType != null) {
          this.ruleFormUse.rangeList[2].check = true;
          if (Data.cardList[0].joinType == 0) {
            this.ruleFormUse.rangeList[2].joinType = "0";
          } else if (Data.cardList[0].joinType == 1) {
            this.ruleFormUse.rangeList[2].joinType = "1";
            this.tableData = Data.cardList[0].list;
          }
        }
        if (Data.startDate != null) {
          this.ruleForm.value6 = [
            util.foryear(Data.startDate),
            util.foryear(Data.endDate)
          ];
        }

        this.validTill(); //有效期
      });
    },
    // 商品品类data
    commodityCategoryfun() {
      getGoodsClassifyTreeList().then(res => {
        this.saleStatusArray = res.data;
        let allClassifyTreeList = [
          {
            value: "",
            label: "全部",
            children: res.data
          }
        ];
        this.commodityCategoryfunList = allClassifyTreeList;
      });
    },
    // 商品品牌data
    commodityBrand() {
      getGoodsLabelListByShopId({
        labelType: "0",
        shopId: this.merchantId
      }).then(res => {
        this.commodityBrandList = res.data.list;
        let allLabelListt = [
          {
            value: "",
            label: "全部",
            children: res.data.list,
            name: "全部"
          }
        ];
        this.LabelListt = allLabelListt;
      });
    },
    //===============data end============
    //重置
    reset() {
      this.commodBrand = "";
      this.keyword = "";
      this.commodityClassification = "";
    },
    added() {
      let scope = [];
      this.ruleFormUse.rangeList.forEach((i, index) => {
        if (i.check == true) {
          i.conditionList = [];
          i.goodsList = [];
          if (i.joinType != 0) {
            if (i.joinBoolean != undefined) {
              i.isUse = i.joinBoolean ? 1 : !i.joinBoolean ? 0 : "";
            }
          } else {
            i.isUse = 0;
          }

          if (i.applyType == 0) {
            if (i.joinType == 1) {
              this.Datagodds.forEach(ele => {
                let a = {
                  goodsId: "",
                  goodsName: "",
                  goodsType: "",
                  price: ""
                };
                a.goodsId = ele.id;
                a.goodsName = ele.name;
                a.goodsType = 0;
                i.goodsList.push(a);
              });
            } else if (i.joinType == 2) {
              i.commodBrand.forEach(ele => {
                let listObj = {
                  conditionId: "",
                  conditionType: ""
                };
                listObj.conditionId = ele;
                listObj.conditionType = 0;
                i.conditionList.push(listObj);
              });
              i.classi.forEach(ele => {
                let listObj = {
                  conditionId: "",
                  conditionType: ""
                };
                listObj.conditionId = ele;
                listObj.conditionType = 1;
                i.conditionList.push(listObj);
              });
            }
          } else if (i.applyType == 1) {
            if (i.joinType == 1) {
              this.Dataserve.forEach(ele => {
                let a = {
                  goodsId: "",
                  goodsName: "",
                  goodsType: "",
                  price: ""
                };
                a.goodsId = ele.id;
                a.goodsName = ele.name;
                a.price = ele.price;
                a.goodsType = 1;
                i.goodsList.push(a);
              });
            }
          } else if (i.applyType == 2) {
            if (i.joinType == 1) {
              this.tableData.forEach(ele => {
                let a = {
                  goodsId: "",
                  goodsName: "",
                  goodsType: "",
                  price: ""
                };
                a.goodsId = ele.id;
                a.goodsName = ele.name;
                a.price = ele.originPrice;
                a.goodsType = 2;
                i.goodsList.push(a);
              });
            }
          }

          scope.push(i);
        }
      });

      let data = {
        orgId: this.merchantId,
        ticketName: this.ruleForm.name,
        ticketSubName: this.ruleForm.region,
        ticketType: this.ruleForm.resource,
        ticketAmount: this.ruleForm.rate1,
        limitAmount: this.ruleForm.rate,
        validType: this.ruleForm.radios,
        validDay: this.ruleForm.validDay,
        // startDate: this.ruleForm.value6[0],
        // endDate: needEndtime,
        ticketDesc: this.ruleFormTicket.explain,
        useInstructions: this.ruleFormTicket.use,
        rangeList: scope,
        shopList: this.ruleFormUse.shopList
      };
      if (this.ruleForm.radios == 1) {
        data.startDate = this.ruleForm.value6[0];
        data.endDate = this.ruleForm.value6[1] + " " + "23:59:59";
      }
      if (this.linkName !== "" || this.linkName !== null) {
        data.creator = this.linkName; //活动创建人
      } else {
        data.creator = this.userInfo.mobile; //活动创建人
      }
      if (this.id != "") {
        data.id = this.id;
      }
      saveOrUpdateMarketTicket(data).then(res => {
        if (res.code == 200) {
          this.$message({
            type: "success",
            message: res.msg
          });
          history.back();
        }
      });
    },
    //=================次卡==============
    //选择次卡
    handleCancel(index) {
      this.tableData.splice(index, 1);
    },
    changeFun_card(val) {
      if (val) {
        this.selection_card = val;
      } else {
        this.selection_card = [];
      }
    },
    getcika() {
      this.cikalist(this.pageDataCard.pageSize, this.pageDataCard.currentPage);
    },
    getcikaData() {
      this.pageDataCard.currentPage = 1;
      this.cikalist(this.pageDataCard.pageSize, this.pageDataCard.currentPage);
    },
    save_card() {
      this.memorydelet(this.tableData, this.tableDatacard, this.selection_card);
      if (this.selection_card.length === 0 && this.tableData.length == 0) {
        this.$message({
          type: "error",
          message: "请先选择次卡!"
        });
      } else {
        this.tableData = this.selection_card.concat(this.tableData);
        var allArr = [];
        for (var i = 0; i < this.tableData.length; i++) {
          var flag = true;
          for (var j = 0; j < allArr.length; j++) {
            if (this.tableData[i].id == allArr[j].id) {
              flag = false;
            }
          }
          if (flag) {
            allArr.push(this.tableData[i]);
          }
        }
        this.tableData = allArr;
        this.dialogTableVisible_card = false;
      }
    },
    cikalist(pageSize, pageNum) {
      this.tableDatacard = [];
      let data = {
        pageNum: pageNum,
        pageSize: pageSize,
        status: 0,
        companyId: this.merchantId,
        name: this.keywordcard
      };
      timesCardListPage(data).then(res => {
        this.tableDatacard = res.data.list;
        this.pageDataCard.totalItems = res.data.totalRecord;
        this.memoryChecked(
          this.tableDatacard,
          this.tableData,
          this.$refs.multipleTablecard
        );
      });
    },
    //=================次卡end==============
    //==============服务============
    //选择服务
    handleCancel_serve(index) {
      this.Dataserve.splice(index, 1);
    },
    changeFun_serve(val) {
      if (val) {
        this.selection_serve = val;
      } else {
        this.selection_serve = [];
      }
    },
    save_serve() {
      this.memorydelet(this.Dataserve, this.cangArray, this.selection_serve);
      if (this.selection_serve.length === 0 && this.Dataserve.length == 0) {
        this.$message({
          type: "error",
          message: "请先选择服务!"
        });
      } else {
        this.Dataserve = this.selection_serve.concat(this.Dataserve);
        var allArr = [];
        for (var i = 0; i < this.Dataserve.length; i++) {
          var flag = true;
          for (var j = 0; j < allArr.length; j++) {
            if (this.Dataserve[i].id == allArr[j].id) {
              flag = false;
            }
          }
          if (flag) {
            allArr.push(this.Dataserve[i]);
          }
        }
        this.Dataserve = allArr;
        this.dialogTableVisible_serve = false;
      }
    },
    getserdata() {
      this.getServiceData(
        this.pageDataService.pageSize,
        this.pageDataService.currentPage
      );
    },
    searchSelectCang() {
      this.pageDataService.currentPage = 1;
      this.getServiceData(
        this.pageDataService.pageSize,
        this.pageDataService.currentPage
      );
    },
    getServiceData(pageSize, pageNum) {
      this.cangArray = [];
      let data = {
        keyword: "",
        pageSize: pageSize,
        companyId: this.merchantId,
        keyword: this.keywordCang,
        status: 0,
        pageNum: pageNum
      };
      serviceListPage(data).then(res => {
        this.cangArray = res.data.list;
        this.pageDataService.totalItems = res.data.totalRecord;
        this.memoryChecked(
          this.cangArray,
          this.Dataserve,
          this.$refs.multipleTableser
        );
      });
    },
    //  // 商品批量多选删除
    // deletmoreStoregoods() {
    //   this.multipleTable.forEach(ele => {
    //     this.ruleFormUse.shopList.forEach((i, index) => {
    //       if (ele.id == i.id) {
    //         this.ruleFormUse.shopList.splice(index, 1);
    //       }
    //     });
    //   });
    //   this.ruleFormUse.shopList;
    // },
    //==============服务end============
    //==================商品================
    //选择商品
    save_good() {
      this.memorydelet(this.Datagodds, this.goodArray, this.selection_good);
      if (this.Datagodds.length === 0 && this.selection_good.length == 0) {
        this.$message({
          type: "error",
          message: "请先选择商品!"
        });
      } else {
        this.memorydelet(this.Datagodds, this.goodArray, this.selection_good);
        this.Datagodds = this.selection_good.concat(this.Datagodds);
        //  this.tableData = this.tableData.concat(this.selection_good);
        var allArr = [];
        for (var i = 0; i < this.Datagodds.length; i++) {
          var flag = true;
          for (var j = 0; j < allArr.length; j++) {
            if (this.Datagodds[i].id == allArr[j].id) {
              flag = false;
            }
          }
          if (flag) {
            allArr.push(this.Datagodds[i]);
          }
        }
        this.Datagodds = allArr;
        this.$refs.multipleTablegood.clearSelection();
        this.dialogTableVisible_good = false;
      }
    },
    //删除选择商品
    handleCancel_good(index) {
      this.Datagodds.splice(index, 1);
    },
    //商品弹窗选择
    changeFun_good(val) {
      if (val) {
        this.selection_good = val;
      } else {
        this.selection_good = [];
      }
    },
    //商品data
    getGoods(pageSize, pageNum) {
      this.goodArray = [];
      let data = {
        name: this.keyword,
        pageSize: pageSize,
        pageNo: pageNum,
        shopId: this.merchantId,
        brandId: this.commodBrand,
        primaryClassifyId: this.commodityClassification,
        status: 0
      };
      findGoodsListPage(data).then(res => {
        this.goodArray = res.data.list;
        this.pageDataGoods.totalItems = res.data.total;
        this.memoryChecked(
          this.goodArray,
          this.Datagodds,
          this.$refs.multipleTablegood
        );
      });
    },
    selectgoods() {
      this.pageDataGoods.currentPage = 1;
      this.getGoods(
        this.pageDataGoods.pageSize,
        this.pageDataGoods.currentPage
      );
    },
    //选择商品 分页
    goods() {
      this.getGoods(
        this.pageDataGoods.pageSize,
        this.pageDataGoods.currentPage
      );
    },
    //选择商品
    changejoinType(val) {
      if (val == 0) {
      }
    },
    //==================商品end================
    validTill() {
      if (this.ruleForm.radios == "0") {
        this.$delete(this.ruleForm, "adate");
        this.$set(this.ruleForm, "adate", false);
        this.$set(this.ruleForm, "value6", []);
      } else {
        this.$delete(this.ruleForm, "adate");
        this.$set(this.ruleForm, "adate", true);
        this.$set(this.ruleForm, "validDay", "");
      }
    },
    submitFormwc(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.added();
        } else {
          return false;
        }
      });
    },
    Radio() {
      let bool = 0;
      let list = this.ruleFormUse.rangeList;
      if (this.ruleFormUse.shopList.length == 0) {
        this.$message({
          type: "error",
          message: "请选择门店范围！"
        });
      } else {
        for (let i = 0; i < list.length; i++) {
          if (list[i].check == false || list[i].joinType == "") {
            bool += 1;
          } else {
            switch (i) {
              case 0:
                if (list[i].joinType == 1 && this.Datagodds.length == 0) {
                  bool += 3;
                } else if (
                  list[i].joinType == 2 &&
                  list[0].commodBrand.length == 0 &&
                  list[0].classi == 0
                ) {
                  bool += 1;
                }
                break;
              case 1:
                if (list[i].joinType == 1 && this.Dataserve.length == 0) {
                  bool += 3;
                }
                break;
              case 2:
                if (list[i].joinType == 1 && this.tableData.length == 0) {
                  bool += 3;
                }
                break;
              default:
                break;
            }
          }
        }
        if (bool >= 3) {
          this.$message({
            type: "error",
            message: "请选择适用范围！"
          });
        } else {
          this.active = this.active + 1;
        }
      }
    },
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (parseInt(this.ruleForm.rate) < parseInt(this.ruleForm.rate1)) {
            this.$message({
              type: "error",
              message: "面值大于满足金额,请重新输入!"
            });
          } else {
            if (
              this.ruleForm.validDay == "" &&
              this.ruleForm.value6.length == 0
            ) {
              this.$message({
                type: "error",
                message: "请选择有效期！"
              });
            } else {
              if (this.ruleForm.radios == 1) {
                let now = new Date().getTime();
                let endTime = new Date(
                  this.ruleForm.value6[1] + " " + "23:59:59"
                ).getTime();
                if (now >= endTime) {
                  this.$message({
                    type: "error",
                    message: "请选择有效时间范围！"
                  });
                } else {
                  this.active = this.active + 1;
                }
              } else {
                this.active = this.active + 1;
              }
            }
          }
        } else {
          return false;
        }
      });
    },
    astep(row) {
      if (row == 1) {
        this.$refs.ruleFormTicket.clearValidate();
      }
      this.active = this.active - 1;
    },
    //选中商品 服务 次卡 按钮
    commods() {
      this.ruleFormUse.rangeList[0].joinType = "";
      if (this.ruleFormUse.rangeList[0].check) {
        this.Datagodds = [];
      }
    },
    serves() {
      this.ruleFormUse.rangeList[1].joinType = "";
      if (this.ruleFormUse.rangeList[1].check) {
        this.Dataserve = [];
      }
    },
    cards() {
      this.ruleFormUse.rangeList[2].joinType = "";
      if (this.ruleFormUse.rangeList[2].check) {
        this.tableData = [];
      }
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
    changeDisabled(val) {
      if (val == "0") {
        this.disabled = true;
        this.ruleForm.value6 = [];
      } else {
        this.disabled = false;
        this.ruleForm.validDay = "";
      }
    },

    // -------------------------------门店-------------------
    // 点击选择门店
    clickSelectStores() {
      this.getStore(
        this.pageDataStore.pageSize,
        this.pageDataStore.currentPage
      );
      this.dialogStore = true;
    },
    // 弹窗里确定选择门店弹窗
    confirmSelectStore() {
      this.memorydelet(
        this.ruleFormUse.shopList,
        this.tableDataDialogStore,
        this.mutableStore
      );
      if (
        this.ruleFormUse.shopList.length === 0 &&
        this.mutableStore.length == 0
      ) {
        this.$message.error("请先选择门店");
        return false;
      }

      this.ruleFormUse.shopList = this.ruleFormUse.shopList.concat(
        this.mutableStore
      );
      // for (let i = 0; i < this.ruleFormUse.shopList.length - 1; i++) {
      //   for (let j = i + 1; j < this.ruleFormUse.shopList.length; j++) {
      //     if (
      //       this.ruleFormUse.shopList[i].id == this.ruleFormUse.shopList[j].id
      //     ) {
      //       this.ruleFormUse.shopList.splice(j, 1);
      //     }
      //   }
      // }
      this.$refs.multipleTableStore.clearSelection();
      this.dialogStore = false;
    },
    // 弹窗门店里面的查询
    searchStore() {
      this.pageDataStore.currentPage = 1;
      this.getStore(
        this.pageDataStore.pageSize,
        this.pageDataStore.currentPage
      );
    },
    //查询门店
    getStore(pageSize, pageNum) {
      this.tableDataDialogStore = [];
      let data = {
        nameOrCode: this.selectData.storeName,
        shopType: this.selectData.storeType,
        pageNum: pageNum,
        pageSize: pageSize,
        openAccount: "", // 是否开户，0-否，1-是
        businessId: this.merchantId,
        type: 3 //1供应商（查找客户） 2-客户（查找供应商） 3-连锁（查客户）
      };
      selectBaseShopPageList(data).then(res => {
        if (res.code == 200) {
          this.tableDataDialogStore = res.data.list;
          this.pageDataStore.totalItems = res.data.pageTotal;
          this.memoryChecked(
            this.tableDataDialogStore,
            this.ruleFormUse.shopList,
            this.$refs.multipleTableStore
          );
        }
      });
    },
    // 弹窗中门店多选
    selectStore(val) {
      this.mutableStore = val;
    },
    //门店批量多选
    handleSelectionChange(val) {
      console.log(val);
      this.multipleTable = val;
    },
    //商品批量多选
    handleSelectionChangegoods(val) {
      this.multipleTablegoods = val;
    },
    //服务批量多选
    handleSelectionChangeservice(val) {
      this.multipleTableservice = val;
    },
    //次卡批量多选
    handleSelectionChangecard(val) {
      this.multipleTablecards = val;
    },
    // 批量多选删除
    deletmoreStore(multip, table) {
      multip.forEach(ele => {
        table.forEach((i, index) => {
          if (ele.id == i.id) {
            table.splice(index, 1);
          }
        });
      });
    },
    //门店删除
    deleteStore(index, rows) {
      rows.splice(index, 1);
    },
    // -------------------------------门店end-------------------

    //记忆函数
    memoryChecked(dialogArr, checkArr, refarr) {
      dialogArr.forEach((row, index) => {
        let check = false;
        checkArr.forEach(ele => {
          if (row.id == ele.id) {
            check = true;
          }
        });
        if (check) {
          refarr.toggleRowSelection(row, true);
        }
      });
    }, //
    //  回显
    memorydelet(listArr, dialogArr, refarr) {
      let deletearr = []; //弹窗当前页中曾经选过的行
      listArr.forEach(ele => {
        dialogArr.forEach(row => {
          if (ele.id == row.id) {
            deletearr.push(ele);
          }
        });
      });
      deletearr.forEach(row => {
        let bool = false;
        refarr.forEach(i => {
          if (i.id == row.id) {
            bool = true;
          }
        });
        if (bool == false) {
          listArr.forEach((ele, index) => {
            if (row.id == ele.id) {
              listArr.splice(index, 1);
            }
          });
        }
      });
    }
  }
};
</script>
<style scoped>
#app {
  text-align: left;
}
.head-box {
  width: 70%;
  margin: 30px 0px 30px 200px;
}
.content {
  margin-left: 30px;
}
.content-form {
  width: 500px;
}
.content-form1 {
  width: 1000px;
}
.mjje {
  width: 500px;
  height: 60px;
  line-height: 60px;
  text-indent: 10px;
}
.mjje span {
  margin-left: 10px;
}
.mjje .el-input-group__append {
  width: 5px;
  padding: 0;
}
.tail {
  width: 800px;
  margin: 100px auto;
}
.tail .el-form-item {
  margin-left: 450px;
}
.content-span {
  margin: 30px 0 30px 200px;
  color: #c0c4cc;
}
.tableSearchs {
  position: relative;
}
.tableSearchs .el-input__icon {
  position: absolute;
  top: 12px;
  left: 190px;
  z-index: 10;
  width: 25px;
  height: 35px;
}
.content-spans {
  margin-top: 60px;
  width: 700px;
  color: #c0c4cc;
}
.wordNumber {
  position: absolute;
  bottom: 0px;
  left: 348px;
  font-weight: normal;
  color: #ccc;
  font-size: 12px;
}
.smallItem {
  display: inline-block;
  padding: 10px 0;
}
.colLine {
  margin-bottom: 10px;
}
</style>
<style>
.Receive .el-form-item__error {
  top: 38px;
}
</style>
